<template>
  <div class="app-page">
    <aside-tree
      title="安检任务单"
      :tree-data="treeData"
      :mouse-button="false"
      :loading="$loadingPlugin.getTreeData"
      @currentChange="currentChange"
      @refresh="getTreeData"
    />
    <div class="table">
      <el-table-form ref="form">
        <el-form-item :table-form-merge="2.2" class="merge-item">
          <el-select v-model="timeType" style="width: 160px; margin-right: 2px;">
            <el-option label="派单时间" value="createTime" />
            <el-option label="处理时间" value="auditDt" />
          </el-select>
          <el-date-picker
            v-model="date"
            type="datetimerange"
            unlink-panels
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
          />
        </el-form-item>
        <el-form-item label="商品分类:">
          <el-select v-model="query.planDetailStatus" placeholder="请选择" clearable>
            <el-option v-for="(i, ind) in enumerationType" :key="ind" :label="i.desc" :value="i.value" />
          </el-select>
        </el-form-item>
        <el-form-item label="销售渠道:">
          <el-select v-model="query.planDetailStatus" placeholder="请选择" clearable>
            <el-option v-for="(i, ind) in enumerationType" :key="ind" :label="i.desc" :value="i.value" />
          </el-select>
        </el-form-item>
        <template v-slot:btns>
          <el-button v-permission="1" type="primary" icon="el-icon-search" @click="search">查询</el-button>
        </template>
      </el-table-form>
      <div>
        4546
      </div>
    </div>
  </div>
</template>

<script>
  import getTreeData from '@/utils/jsonTree'
  import AsideTree from '@/views/components/OrgTree'
  import { organizationQueryList } from '@/api'
  import moment from 'dayjs'

  export default {
    name: 'addition',
    components: {
      AsideTree
    },
    data() {
      return {
        treeData: [],
        enumerationType: [],
        query: {
          orgSNNo: '',
          csmType: '',
          planDetailStatus: ''
        },
        timeType: 'createTime',
        date: [moment().startOf('month'), moment().endOf('hour')]
      }
    },
    computed: {},
    async created() {
      await this.getTreeData()
    },
    methods: {

      // 查询
      async search() {},
      // 清除对象空属性
      _getQuery(obj) {
        const query = {}
        for (const key in obj) {
          if (obj.hasOwnProperty(key)) {
            if (obj[key] !== '') {
              query[key] = obj[key]
            }
          }
        }
        return query
      },
      // 选择组织机构变化
      currentChange(current) {
        if (current.orgSNNo) {
          this.query.orgSNNo = current.orgSNNo
        } else {
          this.$message({
            message: '请选择机构',
            type: 'warning'
          })
        }
      },
      // 获取组织机构数据
      async getTreeData() {
        const res = await organizationQueryList()
        const data = res.data.map(item => ({
          label: item.orgName,
          ...item
        }))
        this.treeData = getTreeData(data)
      }
    }
  }
</script>

<style lang="scss" scoped>
.app-page {
  display: flex;
  height: calc(100vh - 125px);
  padding: 0;
  .table {
    width: calc(100% - 270px);
    margin-left: 10px;
  }
}
</style>
